<style>
    body{
        background-color: #f9f9f9;
    }
</style>
<div>
    <ul class="nav nav-tabs" role="tablist">
        <li role="presentation" class="active"><a href="#info" aria-controls="home" role="tab" data-toggle="tab">总览</a></li>
        {% for code in versionCode %}
            <li role="presentation"><a href="#code_{{ code }}" aria-controls="profile" role="tab" data-toggle="tab">版本-{{ code }}</a></li>
        {% endfor %}
    </ul>
    <div class="tab-content">
        <div role="tabpanel" class="tab-pane active" id="info">
            <table class="table table-hover">
                <tr class="info">
                    <th>版本号</th>
                    <th>版本名</th>
                    <th>应安装人数</th>
                    <th>实际安装数</th>
                </tr>
                {% for info in versionInfo %}
                    <tr>
                        <td>{{ info['versionCode'] }}</td>
                        <td>{{ info['versionName'] }}</td>
                        <td>{{ info['beInstalledNum'] }}</td>
                        <td>{{ info['actualInstalledNum'] }}</td>
                    </tr>
                {% endfor %}
            </table>
        </div>
        {% for code in versionCode %}
            <div role="tabpanel" class="tab-pane" id="code_{{ code }}">
                <table class="table table-hover">
                    <tr class="info">
                        <th>姓名</th>
                        <th>安装版本</th>
                        <th>版本名称</th>
                    </tr>
                    {% for row in versionDetail[code] %}
                        <tr>
                            <td>{{ row['userName'] }}</td>
                            <td>{{ row['installVersion'] }}</td>
                            <td>{{ row['versionName'] }}</td>
                        </tr>
                    {% endfor %}
                </table>
            </div>
        {% endfor %}
    </div>
</div>